<template>
  <div>
    <van-nav-bar title="浏览记录" fixed left-arrow @click-left="onClickLeft" />
    <div class="today"></div>
    <template v-for="(item, index) in historyList">
      <van-swipe-cell :key="index" >
        <van-card
          @click.native="openItem(item)"
          :price="item.retailPrice + '.00'"
          :title="item.name"
          :thumb="item.picUrl"
        >
         
        </van-card>
        <template #right>
          <van-button
            square
            text="删除"
            type="danger"
            class="delete-button"
            @click="delToday(item, index)"
          />
        </template>
      </van-swipe-cell>
    </template>
    <!-- <div class="today">更早</div>
    <div>
      <template v-for="(item, index) in moreEarlyList">
        <van-swipe-cell :key="index" >
          <van-card
            @click.native="openItem(item)"
            :price="item.retailPrice + '.00'"
            :title="item.name"
            :thumb="item.picUrl"
          >
          </van-card>
          <template #right>
            <van-button
              square
              text="删除"
              type="danger"
              class="delete-button"
              @click="delEaryl(item, index)"
            />
          </template>
        </van-swipe-cell>
      </template>
    </div> -->
  </div>
</template>

<script>
import { NavBar, Card, SwipeCell, Button, Toast } from "vant";
import { getHistoryList, delHistoryItem } from "@/network";
export default {
  name: "History",
  data() {
    return {
     
      loading: false,
      finished: false,
      historyList: [],
     
    };
  },
  components: {
    [NavBar.name]: NavBar,
    [Card.name]: Card,
    [SwipeCell.name]: SwipeCell,
    [Button.name]: Button,
    [Toast.name]: Toast,
  },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
    async getHistory() {
      //获取历史足迹列表
      const {
        data: { data },
      } = await getHistoryList();
      console.log(data);
      this.historyList = data.list
    },
    async delEaryl(item, index) {
      // console.log(item, index);
      const { data } = await delHistoryItem({ id: item.id });
      if (data.errno === 0) {
        Toast.success("删除成功");
        this.moreEarlyList.splice(index, 1);
      }
    },
    async delToday(item, index) {
      // console.log(item, index);
      const { data } = await delHistoryItem({ id: item.id });
      if (data.errno === 0) {
        Toast.success("删除成功");
        this.todayList.splice(index, 1);
      }
    },
    openItem(item) {
      console.log(item.goodsId);
      this.$router.push({
        name: "GoodsDetail",
        query: {
          id: item.goodsId,
        },
      });
    },
  },
  created() {
    this.getHistory();
  },
  mounted() {},
};
</script>

<style lang="less" scoped>
.today {
  margin-top: 50px;
  padding-left: 20px;
  font-size: 16px;
}
.delete-button {
  height: 100%;
}
</style>

